<template>
  <!-- 活动列表 -->
  <div>
    <TopFilter :list="topFilterInit" :cols="3" labelWidth="120" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <FilterTable
      ref="table"
      :columns="columns"
      :isSelectColumn="true"
      :fetchapi="fetchParams"
      :params="flterValue"
      :datakey="'records'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="selectChange"
      columnsRef="projectOperating_projram_commonForm_infoGoodsDialog_01"
    ></FilterTable>
    <div class="dialogBottmView">
      <el-button @click="closeDialog">取 消</el-button>
      <el-button @click="saveDialog" type="primary">保 存</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import {
  getMaterialList,
  getmaterialTypeOneList,
  getMaterialExcelList,
  getMaterialExcelDemoList,
  selectMaterialListByBill,
  batchHandAll,
  batchtyAll
} from '@/api/cms-api/projectOperating/program/push';
import { getRegionString } from '@/api/cms-common/dealerdata';

export default {
  mixins: [dictionary],
  data() {
    return {
      visibleDialog: false,
      initModal: {},
      topFilterInit: this.topFilterInitFun(),
      flterValue: { isXF: 1 }, //参数
      columns: this.creatHeader(),
      fetchParams: null, //ipa 接口
      selectData: [],
      orgAreaString: '' //所有大区，以“，”分割事业部组织ID
    };
  },
  async created() {
    //初始化大区组织ID
    await this.initAreaOrg();
    this.fetchParams = getMaterialList;
  },
  mounted() {
    this.BaseTable = this.$refs.table.$refs.pageTable;
    // console.log(this.value) //获取到行id
    //请求接口进行赋值，自己写吧
    //初始化营销素材类型-一级
    this.initmaterialTypeOne();
  },
  methods: {
    //搜索数据
    topFilterInitFun() {
      return [
        { type: 'INPUT', label: '营销素材代码', fieldName: 'materialCode', placeholder: '请输入', initialValue: '' },
        { type: 'INPUT', label: '营销素材名称', fieldName: 'materialName', placeholder: '请输入', initialValue: '' },
        {
          type: 'SELECT',
          label: '营销素材类型-一级',
          fieldName: 'materialTypeOne',
          placeholder: '请选择',
          initialValue: '',
          itemList: [],
          change: value => {
            this.initmaterialTypeTwo(value);
          }
        },
        {
          type: 'SELECT',
          label: '营销素材类型-二级',
          fieldName: 'materialTypeTwo',
          placeholder: '请选择',
          initialValue: '',
          itemList: [],
          change: value => {
            this.initmaterialTypeThree(value);
          }
        },
        {
          type: 'SELECT',
          label: '营销素材类型-三级',
          fieldName: 'materialTypeThree',
          placeholder: '请选择',
          initialValue: '',
          itemList: [],
          change: value => {
            this.initmaterialTypeFour(value);
          }
        },
        {
          type: 'SELECT',
          label: '营销素材类型-四级',
          fieldName: 'materialTypeFour',
          placeholder: '请选择',
          initialValue: '',
          itemList: [],
          change: value => {
            this.initmaterialTypeFive(value);
          }
        },
        { type: 'SELECT', label: '营销素材类型-五级', fieldName: 'materialTypeFive', placeholder: '请选择', initialValue: '', itemList: [] }
      ];
    }, //搜索获取数据
    changeHandle(val) {
      this.flterValue = Object.assign({}, val, { orgAreaString: this.orgAreaString, isXF: 1 });
      // console.log(val);
    },
    //table表头和数据源
    creatHeader() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        { title: '营销素材代码', dataIndex: 'materialCode', sorter: true },
        { title: '营销素材名称', dataIndex: 'materialName', sorter: true },
        // {
        //   title: '营销素材类型-一级',
        //   dataIndex: 'materialTypeOne',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-二级',
        //   dataIndex: 'materialTypeTwo',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-三级',
        //   dataIndex: 'materialTypeThree',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-四级',
        //   dataIndex: 'materialTypeFour',
        //   sorter: true,
        //   hidden: true
        // },
        // {
        //   title: '营销素材类型-五级',
        //   dataIndex: 'materialTypeFive',
        //   sorter: true,
        //   hidden: true
        // },
        {
          title: '营销素材类型-一级',
          dataIndex: 'materialTypeOneName',
          sorter: true
        },
        {
          title: '营销素材类型-二级',
          dataIndex: 'materialTypeTwoName',
          sorter: true
        },
        {
          title: '营销素材类型-三级',
          dataIndex: 'materialTypeThreeName',
          sorter: true
        },
        {
          title: '营销素材类型-四级',
          dataIndex: 'materialTypeFourName',
          sorter: true
        },
        {
          title: '营销素材类型-五级',
          dataIndex: 'materialTypeFiveName',
          sorter: true
        }
      ];
    },
    //取营销素材类型-一级
    async initmaterialTypeOne() {
      let res = [];
      this.dataParams = { parentTypeId: '' };
      let rd = await getmaterialTypeOneList(this.dataParams);
      for (let i in rd.data) {
        res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
      }
      this.topFilterInit[2].itemList = res;
    },
    //取营销素材类型-二级
    async initmaterialTypeTwo(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeTwo').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeTwo').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[3].itemList = res;
      }
    },
    //取营销素材类型-三级
    async initmaterialTypeThree(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeThree').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[4].itemList = res;
      }
    },
    //取营销素材类型-四级
    async initmaterialTypeFour(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFour').itemList = [];
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[5].itemList = res;
      }
    },
    //取营销素材类型-五级
    async initmaterialTypeFive(parentTypeId) {
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').initialValue = '';
      this.topFilterInit.find(item => item.fieldName === 'materialTypeFive').itemList = [];
      if (parentTypeId != '') {
        let res = [];
        this.dataParams = { parentTypeId: parentTypeId };
        let rd = await getmaterialTypeOneList(this.dataParams);
        for (let i in rd.data) {
          res.push({ text: rd.data[i].materialTypeName, value: rd.data[i].materialTypeId });
        }
        this.topFilterInit[6].itemList = res;
      }
    },
    //复选框选择
    selectChange(data) {
      this.selectData = data;
      // this.selectData = Object.assign({},data);
      // console.log(this.selectData);
    },
    //保存
    saveDialog() {
      // this.$refs.infoActivityDialog.SUBMIT_FORM()
      this.$emit('close', { visible: false, data: this.selectData });
    },
    //取消操作
    closeDialog() {
      this.$emit('close', this.selectData);
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    //加载事业部数据
    async initAreaOrg() {
      this.orgAreaString = await getRegionString();
      this.flterValue.orgAreaString = this.orgAreaString;
    }
  }
};
</script>
